.spi1fr2 {
  --spi1fr0: powderblue;
  --spi1fr1: white;
}
.spi1fr3 {
  --spi1fr0: crimson;
  --spi1fr1: black;
}
.spi1fr4 {
  border: 0;
}
.spi1fr5 {
  background: var(--spi1fr0);
  color: var(--spi1fr1);
  border-radius: 6px;
  transition: all 0.2s;
}
.spi1fr5:hover {
  transform: translateY(-3px);
}
.spi1fr6 {
  font-size: 16px;
  line-height: 24px;
}
.spi1fr7 {
  font-size: 24px;
  line-height: 40px;
}
.spi1fr9:hover {
  box-shadow: 0 10px 6px -6px #777;
}
.spi1fra {
  font-weight: bold;
}
.spi1frc {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}
.spi1frd {
  gap: 20px;
}
@media only screen and (min-width: 600px) {
  .spi1frb {
    border: 2px solid green;
  }
  .spi1frd {
    gap: 30px;
  }
}
